<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单选择器</title>
</head>
<body>
<form>
    用户名：<input type="text"/><br>
    密码：<input type="password"/><br>
    爱好：
    <input type="checkbox" checked="checked"/>篮球
    <input type="checkbox" checked="checked"/>足球
    <input type="checkbox" checked="checked"/>羽毛球<br>
    性别：
    <input type="radio" name="sex" value='male'/>男
    <input type="radio" name="sex" value='female'/>女<br>
    邮箱：<input type="text" name="email" disabled="disabled"/><br>
    所在地：
    <select>
        <option value="1">北京</option>
        <option value="2" selected="selected">天津</option>
        <option value="3">河北</option>
    </select><br>
    <input type="submit" value="提交"/>
</form>
<script type="text/javascript" src="js/jquery-3.6.0.js"></script>
<script type="text/javascript">
    // 1.选择不可用的文本输入框
    // $(':text:disabled').css('background-color', 'red');

    // 2.显示选择爱好的个数
    // $(':submit').click(function () {
    //     alert($(':checkbox:checked').length); // 3
    // });

    // 3.显示选择的城市名称
    $(':submit').click(function () {
        alert($('select>option:selected').html());
    });
</script>
</body>
</html>